<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>节点操作</title>
	<script type="text/javascript" src="../js/jquery-1.12.4.min.js"></script>
	<script type="text/javascript">
		
		$(function(){

			var $span = $('<span><span>元素</span>');
			var $p = $('<p>p段落元素</p>');
			var $h = $('<h1>页面标题</h1>');

			// append和appendTo插入元素到现有元素后
			// prepend和prependTo插入元素到现有元素前
			$('#div1').append($span);
			$('#div1').append($p);


			$span.appendTo('#div1');
			$p.appendTo('#div1');

			$('#div1').before($h);
			$h.insertbefore('#div1');

			// 删除节点
			$p.remove($p);
		})

	</script>
</head>
<body>
	<div id="div1">这是一个div元素</div>
</body>
</html>